<!DOCTYPE html>
<html lang="zh-cmn-Hans">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>鹿程智慧油站商户平台</title>
		<meta name="description" content="鹿程科技是提供加油站互联网化零管系统、营销及支付和大数据分析运营服务的行业领先科技公司。鹿程科技充分了解加油站行业的需求和新兴互联网的发展,依靠业内最先进的科技和标准化的运营,持续帮助油站业务发展创造价值。"/>
		<meta name="keywords" content="智慧油站,鹿程,鹿程智慧油站,鹿程智慧油站微信支付,加油站微信支付,加油站营销管理"/>
		<link rel="icon" href="https://static.zhihuiyouzhan.com.cn/static/styles/admin/img/title.ico" type="image/x-icon">
		<link rel="shortcut icon" href="https://static.zhihuiyouzhan.com.cn/static/styles/admin/img/title.ico" type="image/x-icon">
		<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
		<link rel="stylesheet" href="../layui/css/layui.css" />
		<link rel="stylesheet" href="../css/style.css" />
	</head>
<body>
	<section class="section-right">
		<!--deer-content-->
		<div class="deer-content">
			<div class="marke-recall-tit marke-strategy-tit">
				<dl>创建群发优惠券策略</dl>
				<dl class="active">选择人员<span></span></dl>
				<dl class="actives">确认信息</dl>
			</div>
			<form class="marketing-found layui-form zonghe-form mark-pan" style="margin-top: 100px;" method="post" action="">
				<dl>
                <dt>会员等级</dt>
                <dd class="userlevel"> 
                    <input type="checkbox" name="num1"  title="不限"  lay-skin="primary" lay-filter="checked1" checked>
                    <input type="checkbox"  value="1" name="userlevel[]" lay-skin="primary" title='普通会员'>
                    <input type="checkbox"  value="2" name="userlevel[]" lay-skin="primary" title='中级会员'>
                    <input type="checkbox"  value="3" name="userlevel[]" lay-skin="primary" title='至尊会员'>
                    <input type="checkbox"  value="4" name="userlevel[]" lay-skin="primary" title='普通会员'>
                    <input type="checkbox"  value="5" name="userlevel[]" lay-skin="primary" title='中级会员'>
                    <input type="checkbox"  value="6" name="userlevel[]" lay-skin="primary" title='至尊会员'>
                </dd>
				</dl>
				<dl>
					<dt>消费金额</dt>					
					<dd class="Cost">
                    <input type="checkbox" name="num2"  title="不限" lay-skin="primary" lay-filter="checked2" checked>
                    <input type="checkbox"  value="71" name="Cost[]" lay-skin="primary" title='0-1000'>
                    <input type="checkbox"  value="60" name="Cost[]" lay-skin="primary" title='1001-5000'>
                    <input type="checkbox"  value="72" name="Cost[]" lay-skin="primary" title='5000-20000'>
                    <input type="checkbox"  value="72" name="Cost[]" lay-skin="primary" title='20000以上'>
                   
                </dd>
				</dl>
				<dl>
					<dt>消费次数</dt>					
					<dd class="times">
                    <input  type="checkbox" name="num3"  title="不限"lay-skin="primary" lay-filter="checked3" checked>
                    <input  type="checkbox" value="2" name="times[]" lay-skin="primary" title="0-4">
                    <input  type="checkbox" value="3" name="times[]" lay-skin="primary" title="5-9">
                    <input  type="checkbox" value="4" name="times[]" lay-skin="primary" title="10-19">
                    <input  type="checkbox" value="5" name="times[]" lay-skin="primary" title=" 20以上">
                   
                </dd>
				</dl>
				<dl>
					<dt>黑名单</dt>
		            <dd class="black_check">
		            <input type="radio" name="black_check" value="1" title="过滤">
					<input type="radio" name="black_check" value="2" title="不过滤" checked>
		            </dd>
				</dl>
				<dl>
					<dt>最后消费</dt>
		            <dd class="consume_last_check">
		            <input  type="checkbox" name="consume_last_check[]" lay-skin="primary" title="不限" lay-filter="checked4" checked>
					<div class="layui-inline">
					    <span>限制</span>
					    <div class="layui-input-inline">
						<input name="consume_last_check[]" class="zonghe_time input-redonly" style="height: 25px;" type="text" lay-filter="checked6" placeholder="" id="consume_last_check" value="" >
					    </div>
					    <span>之后</span>
					</div>
		            </dd>
				</dl>
				<dl>
					<dt>注册时间</dt>
		            <dd class="register_checka">
		            <input  type="checkbox" name="register_check[]" lay-skin="primary" title="不限" lay-filter="checked4" checked>
					<div class="layui-inline">
					    <span>限制</span>
					    <div class="layui-input-inline">
						<input name="register_check[]" class="zonghe_time input-redonly" style="height: 25px;" type="text"  placeholder="" id="register_check" value="">
					    </div>
					    <span>之后</span>
					</div>
		            </dd>
				</dl>
				<dl class="clearfix " style="margin-left: 120px;">				
					<div class="order-nav-search">
						<dl>
							<button class="deer-btn" lay-submit lay-filter="get-user">将条件加入队列</button>
	            		</dl>            		
	            	</div>            		
            </dl>
			</form>
			<div class="mark-pan">
				<p>已选择<span class="people">66</span>人，共需发放<span class="all_coupon"> 6</span>张营销券，总价值约<span class="total_money"> 66 </span>元。</p>
				<form class="people-form layui-form" method="post" action="">
					<dl class="layui-inline">
					    <dt class="">会员手机号</dt>
					    <dd>
					    <div class="layui-input-inline">
					    <input type="text" name="price_min" placeholder="请输入手机号" autocomplete="off" class="layui-input">
					  	</div>
					    </dd>
					    <dt lay-submit lay-filter="">查询</dt>
					    <dt style="margin-left: 20px;">清除队列</dt>
					</dl>
				</form>
				<table id="demo" lay-filter="test"></table>
				<div class="mark-remove">批量移除已全选</div>
				<div class="order-table-footer clearfix">
					<div class="order-table-page">
						<div id="datatime">
								
						</div>
					</div>
				</div>
			<!--submit-->
				<div class="marke-strategy-submit">
						下一步，确认信息
				</div>
			</div>
		<!--/deer-content-->
	</section>
	<!--js-->
		<aside>
			<script type="text/javascript" src="../layui/layui.js" ></script>
			<script type="text/javascript">
				layui.use(['jquery','form','layer','table' ,'laydate','laypage'],function(){
					var $=layui.jquery
					var form=layui.form
					var layer=layui.layer;
					var laydate=layui.laydate;
					var table = layui.table;
					var laypage = layui.laypage;
					laydate.render({
				        elem: '#consume_last_check', //指定元素
				       
				   });
				   laydate.render({
				        elem: '#register_check', //指定元素
				      
				   });
					form.on('submit(*)',function(data){
						console.log(data.field);
						return false;
					})
					
					//全选
			form.on('checkbox(checked1)', function(data){
                checkeds(data)
            });
			checkedAlls($('.userlevel'))

			form.on('checkbox(checked2)', function(data){
                checkeds(data)
            });
            checkedAlls($('.Cost'))
            
            form.on('checkbox(checked3)', function(data){
                checkeds(data)
            });
			checkedAlls($('.times'))
			//
			form.on('checkbox(checked4)', function(data){
               if($(data.othis).hasClass('layui-form-checked')){
                	$(data.elem).parent().find(".layui-input-inline>input").addClass("input-redonly");
               }else{
               		$(data.elem).parent().find(".layui-input-inline>input").removeClass("input-redonly");
               }
               
            });
            
          $(".zonghe_time").click(function(){
          $(this).removeClass("input-redonly");
          $(this).parents(".layui-inline").prev().removeClass('layui-form-checked');
          $(this).parents(".layui-inline").prevAll("input").removeAttr("checked");
          });
            //判断是否全选
            function checkeds(data){
                var checkDiv=$(data.elem).parent().children('.layui-form-checkbox')
                var checked=$(data.elem).parent().children(':checkbox')
                if($(data.othis).hasClass('layui-form-checked')){
                	checkDiv.removeClass('layui-form-checked')
                    checked.each(function(index,value){
                        value.checked = data.elem.checked;
                    })
                }else{
                	checkDiv.removeClass('layui-form-checked');                	
                    checked.each(function(index,value){
                        value.checked = data.elem.checked;
                    })
                	$(data.othis).addClass('layui-form-checked');
                   
                }
            }
			//全选判断
            function checkedAlls(all){
            	var nums=0
				all.on('click','.layui-form-checkbox:gt(0)',function () {
					var num=0
					all.find('.layui-form-checkbox:gt(0)').each(function(index,value){
						if($(value).hasClass('layui-form-checked')==false){
							num++
						}
					})
					if(num){
							all.find('.layui-form-checkbox').eq(0).removeClass('layui-form-checked')
									
					}else{
						all.find('.layui-form-checkbox').eq(0).addClass('layui-form-checked');
						//all.find('.layui-form-checkbox:gt(0)').removeClass('layui-form-checked');
					}
				})
				
					all.find('.layui-form-checkbox:gt(0)').each(function(index,value){
						if($(value).hasClass('layui-form-checked')==false){
							nums++
						}
					})
					if(nums){
						all.find('.layui-form-checkbox').eq(0).addClass('layui-form-checked')
					}else{
						all.find('.layui-form-checkbox').eq(0).removeClass('layui-form-checked')
						all.find('.layui-form-checkbox:gt(0)').removeClass('layui-form-checked');
					}
				
			}
		  
		    $('.marke-strategy-submit').bind('click',function(){						
				location.href="群发优惠券-创建活动-确认.html";						
			})
			//加载表格数据
				function init(){
				  var data=[{"id":10000,"name":"金","phone":"15965485421","pian":"--","cost":"900"},{"id":10003,"name":"金","phone":"15965485421","pian":"--","cost":"900"},{"id":10001,"name":"金","phone":"15965485421","pian":"--","cost":"900"},{"id":10002,"name":"金","phone":"15965485421","pian":"--","cost":"900"}];
				  table.render({
				    elem: '#demo'
				  
				    /*,url: '/鹿程/营销中心/aaa.json'*/
				    ,cols: [[ //表头
				      {type:'checkbox', width:'3%'}
				      ,{field: 'name',  width:'19%',align:'center',title: '会员名称',  sort: true}
				      ,{field: 'phone', width:'19%',align:'center',title: '手机号'}
				      ,{field: 'pian',  width:'19%',align:'center',title: '油品偏好', sort: true}
				      ,{field: 'cost',  width:'19%',align:'center',title: '消费金额'}				     
				      ,{fixed: 'right', width:'19%',align:'center',title: '操作', toolbar: '#barDemo'}
				      
				    ]]
				    ,data:data
				  });
				}
				init();
				//分页
				laypage.render({
				    elem: 'datatime'
				    ,count: 100//data.length
				    ,theme: '#00cc9a'
			    	,prev: '«'
			    	,next: '»'
			  	})
				//工具条（删除）监听
				table.on('tool(test)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
				  var data = obj.data; //获得当前行数据
				  var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
				  var tr = obj.tr; //获得当前行 tr 的DOM对象
				 
				  if(layEvent === 'del'){ //删除
				    layer.confirm('真的删除行么', function(index){
				      obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
				      layer.close(index);
				      //向服务端发送删除指令
				    });
				  } 
				});				
				
				//移除全选
				$(".mark-remove").click(function(){
					var checkStatus = table.checkStatus('demo'); 
					if(checkStatus.isAll) //表格是否全选
					{
						var checkDiv=$('.layui-table-box').find('.layui-form-checkbox');
	                	var checked=$('.layui-table-box').find(':checkbox');
						checkDiv.removeClass('layui-form-checked')
	                    checked.each(function(index,value){
	                        value.checked =false;
	                        table.cache.demo[index].LAY_CHECKED = false;
	                    })
	                 
					}
					
				});
			})
			</script>
			<script type="text/html" id="barDemo"> 
			  <a class="layui-btn-xs" lay-event="del">移除</a>
			</script>
		</aside>
		<!--/js-->
</body>
</html>